import { createRouter,createWebHistory,RouteRecordRaw} from 'vue-router'

//创建对象类型的数组，用于保存路由地址和对应的匹配Vue组件
//routes 是一个数组，包含了应用中所有路由的配置。每个路由配置是一个对象，
//遵循 RouteRecordRaw 接口，它定义了路由的路径、名称、组件等信息。
const routes:Array<RouteRecordRaw>=[
    {
        path:"/HelloWorld",
        name:"HelloWorld",
        component:()=>import('../components/HelloWorld.vue')
    },

    {
        path:"/",
        name:"Demo",
        component:()=>import('../components/Demo.vue')
    },

    {
        path:"/Login",
        name:"Login",
        component:()=>import('../components/Login.vue')
    },

    {
        path:"/EditDemo/:Sid",
        name:"EditDemo",
        component:()=>import('../components/EditDemo.vue')
    },
]
//createWebHashHistory()用于创建一个使用HTML history API的路由实例 
//RouteRecordRaw()是Vue-Route 用于定义ts的数据类型
//允许您在不重新加载页面的前提下完成数据获取


//创建路由实例 //createRouter()用于创建路由实例
//router 是 vue-router 的实例，它是整个路由系统的入口点。
const router=createRouter(
    {
        history:createWebHistory(),

        //将上面定义的路由数组传递给路由器实例，这样路由器就知道如何处理不同的 URL。
        routes
    }

)

//导出路由
export default router


//关系:
//routes 是定义路由规则的数据结构，告诉 router 如何响应不同的 URL。
//router 是根据 routes 配置来处理 URL 到组件的映射，以及组件之间的导航。













// import { createRouter,createWebHistory,RouteRecordRaw } from "vue-router";

// const routes:Array<RouteRecordRaw>=[
//     {
//         path:"/Login",
//         name:"Login",
//         component:()=>import('../components/Login.vue')
//     },
//     {
//         path:"/",
//         name:"Regist",
//         component:()=>import('../components/Regist.vue')
//     },
// ]

//     const router=createRouter(
//         {
//             history:createWebHistory(),
//             routes
//         }
//     )

//     export default router


